.comments-container{
  margin: 15px auto 20px;
  .comments-breadcrumb{
    margin: 0 auto 15px;    
  }
  .order-comments-contents{
    background: #fff;
    .order-comments-header{
      height: 56px;
      line-height: 56px;
      border-bottom: 1px solid #eee;
      padding: 0 20px;
      .header-title{
        height: 100%;
        font-size: 16px;
        cursor: pointer;
      }
      .comments-tips{
        font-size: 14px;
        color: #888;
        &:hover{
          color: #255B8A;
        }
      }
    }
    .order-comments-list{
      .order-company-wrap{
        padding: 20px 30px;
        .companyName{
          color: #333;
          margin: 0 0 15px 0;
        }
        .order-table{
          border: 1px solid #eee;
          .order-table-header{
            height: 50px;
            line-height: 50px;
            color: #888;
            background: #F9F9F9;
            border-bottom: 1px solid #eee;
            .header-tit{
              float: left;
              text-align: center;
            }
            .product-tit{
              width: 500px;
            }
            .state-tit{
              width: 390px;
            }
            .operate-tit{
              width: 248px;
            }
          }
          .order-table-con{
            .order-table-li{
              width: 100%;
              height: 120px;
              border-bottom: 1px solid #eee;
              text-align: center;
              .table-product-info{
                width: 500px;
                margin-top: 20px;
                text-align: left;
                .pd-pic-view{
                  display: inline-block;
                  width: 80px;
                  height: 80px;
                  background: #eee;
                  border-radius: 5px;
                  vertical-align: middle;
                  margin-left: 20px;
                  img{
                    width: 80px;
                    height: 80px;
                    border-radius: 5px;
                    cursor: pointer;
                  }
                }
                .pd-title{
                  display: inline-block;
                  width: 350px;
                  vertical-align: middle;
                  text-align: left;
                  margin-left: 10px;
                  line-height: 20px;
                  cursor: pointer;
                  &:hover{
                    color: #255B8A;
                  }
                }
              }
              .table-product-state{
                width: 390px;
                color: #888;
                margin-top: 50px;
              }
              .table-product-operation{
                width: 248px;
                margin-top: 30px;
                text-align: center;
                .operate-button{
                  margin-bottom: 8px;
                }
                .add-btn{
                  min-width: 40px;
                  padding: 0 10px;
                  height: 26px;
                  line-height: 26px;
                  text-align: center;
                  background: #f4f4f4;
                  border: 1px solid #ddd;
                  border-radius: 4px;
                  color: #333;
                  display: inline-block;
                  vertical-align: top;
                  text-align: center;
                  text-decoration: none;
                  &:hover{
                    color: #333;
                    background: #ddd;
                  }
                }
                .goComments{
                  width: 60px;
                  height: 26px;
                  line-height: 26px;
                  text-align: center;
                  background: #eee;
                  border: 1px solid #ddd;
                  border-radius: 5px;
                  margin: 15px auto;
                }
              }

            }
            .order-table-li:last-child{
              border-bottom: none;
            }
          }
        }
      }
    }
    
  }
}

.wrap-comments-container{
  margin: 20px auto 30px;
  .wrap-comments-breadcrumb{
    margin: 15px;
  }
  .wraps-comments-inner{
    background: #fff;
    .wrap-header{
      height: 56px;
      line-height: 56px;
      padding: 0 20px;
      border-bottom: 1px solid #eee;
      .wrap-title{
        font-size: 16px;
        color: #333;
        
      }
      .comments-tips{
        color: #888;
        font-size: 14px;
        cursor: pointer;
        &:hover{
          color: #255B8A;
        }
      }
    }
    .wrap-comments-con{
      padding: 30px;
      .wrap-comments-detail{
        height: 360px;
        border: 1px solid #eee;
        .wrap-detail-left{
          width: 300px;
          height: 280px;
          border-right: 1px solid #eee;
          text-align: center;
          margin-top: 40px;
          .detail-img{
            width: 110px;
            height: 110px;
            border-radius: 5px;
            margin: 50px auto 15px;
          }
          .pd-title{
            font-size: 14px;
            color: #333;
            margin: 0 auto;
            line-height: 20px;
            width: 245px;
            text-align: left;
          }
        }
        .wrap-detail-right{
          .wrap-commentsDetail{
            margin: 45px 0 0 70px;
            .wrap-comments-item{
              overflow: hidden;
              zoom: 1;
              margin-bottom: 15px;
              .wrap-left-label{
                width: 100px;
                vertical-align: middle;
              }
              .wrap-right-con{
                vertical-align: middle;
                textarea{
                  display: inline-block;
                  width: 540px;
                  height: 120px;
                  border: 1px solid #eee;
                  resize: none;
                  outline: none;
                  padding: 15px;
                }
                .wrap-camera{
                  width: 60px;
                  height: 60px;
                  border: 1px solid #eee;
                  border-radius: 5px;
                  background: #f7f7f7;
                  text-align: center;
                  .defaultImg{                    
                    margin-top: 18px;
                  }
                }
                .uploadImg-tips{
                  margin: 10px 0 0 0;
                  font-size: 12px;
                  color: #888;
                }
              }
            }
          }
          .comments-result{
            margin-left: 50px;
            margin-top: 40px;
            .comments-msg{
              .comments-date{
                font-size: 14px;
                color: #333;
              }
              .el-rate{
                display: inline-block;
                margin-left: 20px;
              }
            }
            .comments-text{
              width: 700px;
              margin: 20px 0;
              line-height: 20px;
            }
            .comments-pic{
              .comments-img{
                display: inline-block;
                width: 60px;
                height: 60px;
                background: #eee;
                border-radius: 5px;
                margin-right: 10px;
              }
            }
          }
        }
      }
      .wrap-comments-scores{
        height: 80px;
        border: 1px solid #eee;
        margin-top: 20px;
        padding: 0 50px;
        .wrap-scores-list{
          width: 33%;
          text-align: center;
          margin-top: 30px;
          .scores-header{
            vertical-align: middle;
          }
          .el-rate{
            // float: left;
            display: inline-block;
            vertical-align: middle;
            margin-left: 30px;
          }
        }
      }
      .wrap-submit{
        margin-top: 40px;
        .submitBtn{
          width: 160px;
          height: 48px;
          line-height: 48px;
          text-align: center;
          font-size: 16px;
          color: #fff;
          background: #255B8A;
          border-radius: 10px;
          margin: 0 auto;
        }
      }
    }
  }
}